<template>
  <div class="page-container">
    <page_breadcrumb :getKeyMethod="init_table_model" @change="change_table_model" pageOption />
    <ex_super_table_page v-bind="option" ref="SuperTablePage" @selection-change="e => selection = e">

    </ex_super_table_page>

    <ex_super_dialog_form ref="operateDialog" v-bind="operateDialog" @afterSubmitSuccess="reload">
    </ex_super_dialog_form>
  </div>
</template>
<script>

import superTablePageFunction from '@/mixin/super-table-page-function';
import emitOnFunction from '@/mixin/emit-on-function';

import page_table_model_manage from '@/mixin/page_table_model_manage';
let emitKey = 'outbound>send_good_reservation'

export default {
  title: 'label_send_good_reservation',
  mixins: [superTablePageFunction, emitOnFunction(emitKey), page_table_model_manage],
  components: {},
  data() {
    return {
      status: "",
      reservationTimeFrom: null,
      reservationTimeTo: null,
      createTimeFrom: null,
      createTimeTo: null,
      selection: [],
      option: {
        search: {
          model: [

            { key: 'orderNo', label: 'label_schedule_code', },

            { key: 'reservationOrderNo', label: 'label_platform_schedule_code', },

            { key: 'status', label: 'label_status', type: 'select', enum: 'WmsReservationOrderStatusEnum' },
            { key: 'platformCode', label: 'label_platform', type: "select", enum: 'SrmOrderTypeEnum' },
            { key: 'warehouseName', label: 'label_warehouse_name', },
            { key: 'vehicleNo', label: 'label_car_number', },
            {
              label: "label_appointment_time", key: 'startReservationTime', type: 'date-picker',
              placeholder: "label_appointment_start_time", attrs: { type: 'datetime' },
              on: { change: (e) => this.reservationTimeFrom = e },
              pickerOptions: {
                disabledDate: (date) => {
                  if (this.reservationTimeTo) {
                    return this.reservationTimeTo < date.getTime()
                  }
                  return false
                }
              }

            },
            {
              label: "~", key: 'endReservationTime', type: 'date-picker',
              placeholder: "label_appointment_end_time", attrs: { type: 'datetime' },
              on: { change: (e) => this.reservationTimeTo = e },
              'pickerOptions': {
                disabledDate: (date) => {
                  if (this.reservationTimeFrom) {
                    return this.reservationTimeFrom > date.getTime()
                  }
                  return false
                }
              }
            },

            {
              label: "label_create_time", key: 'startCreateTime', type: 'date-picker',
              placeholder: "label_create_start_time", attrs: { type: 'datetime' },
              on: { change: (e) => this.createTimeFrom = e },
              pickerOptions: {
                disabledDate: (date) => {
                  if (this.createTimeTo) {
                    return this.createTimeTo < date.getTime()
                  }
                  return false
                }
              }

            },
            {
              label: "~", key: 'endCreateTime', type: 'date-picker',
              placeholder: "label_create_end_time", attrs: { type: 'datetime' },
              on: { change: (e) => this.createTimeTo = e },
              'pickerOptions': {
                disabledDate: (date) => {
                  if (this.createTimeFrom) {
                    return this.createTimeFrom > date.getTime()
                  }
                  return false
                }
              }
            },

          ],
        },
        action: [
          {
            label: { _key: 'label_new_any', i18n: true, type: 'label_send_good_reservation' }, attrs: { icon: "el-icon-plus" }, click: () => {
              this['$refs']['operateDialog'].showNew({
                title: this.$tt({ _key: 'label_new_any', i18n: true, type: 'label_send_good_reservation' }),
                data: {},
                onlySetData: true,
              })
            }
          },
        ],

        table: {
          url: "/wms-api/outbound/WmsReservationOrderRpc/selectListPage.json",

          model: this.init_table_model(),
        },
      },
      operateDialog: {
        customClass: 'dialog_auto',
        submitUrl: "/wms-api/outbound/WmsReservationOrderRpc/saveReservationOrder.json",
        form: {
          itemClass: "form_item_small",
          inputClass: "form_input_small",
          // formClass: "form_default_col2 flex_row_wrap",
          model: [
            { header: "label_base_info", },
            {
              grid: [
                // [
                //   { span: 12, col: { key: 'orderNo', label: 'label_schedule_code', }, },
                //   { span: 12, col: { key: 'reservationOrderNo', label: 'label_platform_schedule_code', }, },
                // ],
                [
                  { span: 12, col: { key: 'platformCode', label: 'label_platform', type: "select", enum: 'SrmOrderTypeEnum' }, },
                  { span: 12, col: { key: 'warehouseName', label: 'label_warehouse_name', }, },
                ],
                [
                  { span: 12, col: { key: 'driverSurname', label: 'label_driver_surname', }, },
                  { span: 12, col: { key: 'driverName', label: 'label_driver_name', }, },
                ],
                [
                  { span: 12, col: { key: 'vehicleBrand', label: 'label_car_brand', }, },
                  { span: 12, col: { key: 'vehicleNo', label: 'label_car_number', }, },
                ],
                [
                  { span: 12, col: { key: 'phone', label: 'label_driver_phone', }, },
                  // {
                  //   span: 12, col: {
                  //     key: 'reservationTime', label: 'label_appointment_time', type: 'date-picker', attrs: { type: 'datetime' },
                  //   },
                  // },
                ],
              ],
            },


          ],
          rules: {
            // 'orderNo': { required: true, message: this.$tt('tip_can_no_empty'), },
            // 'reservationOrderNo': { required: true, message: this.$tt('tip_can_no_empty'), },
            'platformCode': { required: true, message: this.$tt('tip_can_no_empty'), },
            'warehouseName': { required: true, message: this.$tt('tip_can_no_empty'), },
            'driverSurname': { required: true, message: this.$tt('tip_can_no_empty'), },
            'driverName': { required: true, message: this.$tt('tip_can_no_empty'), },
            'vehicleBrand': { required: true, message: this.$tt('tip_can_no_empty'), },
            'vehicleNo': { required: true, message: this.$tt('tip_can_no_empty'), },
            // 'phone': { required: true, message: this.$tt('tip_can_no_empty'), },
            // 'reservationTime': { required: true, message: this.$tt('tip_can_no_empty'), },

          },
        }
      },
    };
  },
  methods: {
    option_table_model() {
      return [
        // { type: 'selection', clickToggle: true, keyGroup: 'label_table_operate' },
        {
          type: 'expandDesc', 'width': 100,
          expandDesc: {
            ...this.$defaultDescAttrs,
            model: [],
          },
        },

        //         orderNo 	string 	预约单号
        // reservationOrderNo 	string 	平台预约单号
        // platformCode 	string 	平台code
        // warehouseId 	string 	仓库id
        // warehouseCode 	string 	仓库编码
        // warehouseName 	string 	仓库名称
        // driverName 	string 	司机名字
        // driverSurname 	string 	司机姓
        // vehicleBrand 	string 	车辆品牌
        // vehicleNo 	string 	车牌号
        // phone 	string 	联系电话
        // status 	WmsReservationOrderStatusEnum 	状态: PROCESSED_RESERVATION 预约中, COMPLETED_RESERVATION 已预约, INVALID 已失效
        // reservationTime 	long 	预约时间
        // validTime 	long 	有效时间
        {
          key: 'orderNo', label: 'label_schedule_code', 'min-width': 140, 'show-overflow-tooltip': true,
        },
        { key: 'platformCode', label: 'label_platform', 'width': 140, },

        { key: 'vehicleBrand', label: 'label_car_brand', 'width': 140, 'show-overflow-tooltip': true, },
        { key: 'vehicleNo', label: 'label_car_number', 'width': 140, 'show-overflow-tooltip': true, },
        // { key: 'postingNumberList', label: 'label_platform_code', 'min-width': 140, },
        {
          key: 'warehouseName', label: 'label_warehouse_name', 'min-width': 140,
        },
        {
          key: 'driverSurname', label: 'label_driver_surname', 'width': 140, 'show-overflow-tooltip': true,
        },
        {
          key: 'driverName', label: 'label_driver_name', 'width': 140, 'show-overflow-tooltip': true,
        },

        {
          key: 'phone', label: 'label_driver_phone', 'width': 140, 'show-overflow-tooltip': true,
        },
        { key: 'status', label: 'label_status', width: 140, formatter: (r, c, v, i) => this.$enumShow(v, 'WmsReservationOrderStatusEnum') },


        { key: 'reservationTime', label: 'label_appointment_time', width: 140, formatter: (r, c, v, i) => this.$dateFormat(v) },
        { key: 'validTime', label: 'label_effective_time', width: 140, formatter: (r, c, v, i) => this.$dateFormat(v) },
        { key: 'gmtCreate', label: 'label_create_time', width: 140, formatter: (r, c, v, i) => this.$dateFormat(v) },


        {
          type: 'operate', width: 200,
          fixed: 'right',
          operate: [

            // {
            //   label: 'label_view_detail', click: (row) => {
            //     this.$refs.detailDialog.showNew({
            //       title: this.$tt('label_handover_file_detail'),
            //       // data: row,
            //       params: { id: row.id },
            //       // onlySetData: true,
            //     })
            //   }
            // },
            {
              label: 'label_cancel', if: (row) => row.status == 'PROCESSED_RESERVATION',
              type: "confirm-button",
              url: '/wms-api/outbound/WmsReservationOrderRpc/cancelReservationOrder.json',
              message: 'text_confirm_sure_cancel',
              buttonClass: "button_text_danger", confirmButtonType: 'danger',
              params: (row) => { return { "id": row["id"] } }, done: ['reload', 'tip']
            },
          ]
        }
        // { key: 'postingNumberList', label: '订单号列表', 'width': 110, 'show-overflow-tooltip': true, },
      ]
    },



  }
};

</script>
<style></style>
